<template>
  <div class="bc-matches" v-if="!getIsPhone">
    <div id="wrap">
      <!-- 主体内容 -->
      <div class="content">
        <img src="../../assets/imgs/love.png" alt="">
        <div class="img">
        </div>
        <button>开始游戏</button>
      </div>
    </div>
  </div>
  <div class="bc-matches" v-else>
    <header-template-phone>
      <template v-slot:left>
        <header-menu></header-menu>
      </template>
      <template v-slot:center>
        赛事
      </template>
    </header-template-phone>
  </div>
</template>

<script>
import HeaderTemplatePhone from '@/components/base/phone/header-template-phone/header-template-phone'
import HeaderMenu from '@/components/base/header-menu/header-menu'
import { mapGetters } from 'vuex';
export default {
  components: {
    HeaderTemplatePhone,
    HeaderMenu 
  },
  computed: {
    ...mapGetters('lottery', ['getIsPhone'])
  }
}
</script>

<style lang="stylus" scoped>
  @media screen and (min-width 750px)
    .bc-matches
      height 100%
      width 100%
      position absolute 
      top 0
      left 0
      right 0 
      bottom 0
      box-sizing border-box 
      padding-top 128px
      padding-bottom 60px 
      z-index 0
      #wrap
        // 
        width 100%;
        height 100%
        background-color #0e1218;
        .content
            width 1200px;
            height 100% 
            position relative;
            margin-bottom 24px;
            overflow hidden 
            img 
              width 100%
             
            // margin-top 48px;
            // background url('../../assets/imgs/love.png') no-repeat cover 
            .img
                position absolute;
                width 341px;
                height 237px;
                // border 1px solid red;
                top 69px;
                right 40px;
                background url('../../assets/imgs/text.png');
            button
                position absolute;
                cursor pointer;
                font-weight bold;
                font-size 30px;
                color #a85c00;
                width 196px;
                height 60px;
                border none;
                outline none;
                background-color #fff;
                bottom 80px;
                left 502px;
                box-shadow -2px 2px 15px 0 #000;
                background url('../../assets/imgs/btnbgc.png');
                
</style>